<template>
  <div class="auditCmpt">
    <!-- {{carrier}} -->
    <!-- 查询表单 -->
    <div class="form-baseinfo">
      <LPSearchBar
        v-model="searchModel"
        :search-data="searchData"
        label-width="100px"
        @handleSearchSubmit="handleSearchSubmit"
        @handleSearchReset="handleSearchReset"
      />
    </div>
    <!-- 表格列表 -->
    <div class="form-baseinfo">
      <div class="btn_area">
        <!-- <el-input v-model="input" style="width: 6.3rem" @focus="openWeighbridgeDialog(true)"></el-input> -->
        <!-- <el-button size="medium" type="primary" @click="exportInfo">导出数据</el-button> -->
      </div>
      <LPTablePage
        :show-index="false"
        :show-indexfixed="false"
        index-label="顺序"
        :table-data="tableData"
        :table-column="tableColumn"
        :total="total"
        :current-page="currentPage"
        align="center"
        style="margin-top: 10px"
        @handleSizeChange="handleSizeChange"
        @handleCurrentChange="handleCurrentChange"
      >
        <template slot="cz" slot-scope="{ row }">
          <el-button
            v-hasPermi="['LaborProtection.OrdersReturnAudit.Audit']"
            type="text"
            @click="handColumnClick(row, 'aduit')"
            >审核</el-button
          >
        </template>
      </LPTablePage>
    </div>
  </div>
</template>

<script>
import { getReturnOrderAuditList } from '@/api/LaborProtection/returnOrder'
import { parseTime } from '@/utils/lpUtils.js'
import LPSearchBar from '@/components/LPSearchBar/index.vue'
import LPTablePage from '@/components/LPTablePage/index.vue'

export default {
  components: { LPSearchBar, LPTablePage },
  data() {
    return {
      searchModel: {},
      searchData: [
        { label: '', placeholder: '员工卡号', prop: 'UserCardNo', width: '80px' },
        { label: '', placeholder: '员工姓名', prop: 'UserName', width: '80px' },
        { label: '', placeholder: '商品名称', prop: 'ProductTitle', width: '80px' },
        { label: '', placeholder: '退货单', prop: 'ORNo' },
        { label: '', prop: 'StartOrderTime', type: 'datetimerange', placeholder: '开始时间', width: '80px' }
      ],
      // 列表数据
      tableData: [],
      // 表格字段
      tableColumn: [
        { label: '退货单号', prop: 'orNo', width: 200 },
        { label: '姓名', prop: 'userName' },
        { label: '工号', prop: 'userJobNum' },
        { label: '部门', prop: 'departmentName' },
        { label: '岗位', prop: 'jobName' },
        { label: '卡号', prop: 'userCardNo' },
        { label: '退货商品', prop: 'productData' },
        { label: '退回金额', prop: 'orMoney' },
        { label: '订单状态', prop: 'statusName' },
        { label: '操作', prop: 'cz', width: 100, render: true }
      ],
      total: 0,
      currentPage: 1,
      pageSize: 10
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    insertData() {
      this.$router.push({
        path: '/laborProtection/order/returnOrderManage/detail',
        query: {
          list: 120
        }
      })
    },

    // 重置按钮
    handleSearchReset() {
      this.handleSearchSubmit()
    },

    handleSearchSubmit() {
      this.currentPage = 1
      this.getList()
    },
    getList() {
      const params = {
        ...this.searchModel,
        SkipCount: this.currentPage,
        MaxResultCount: this.pageSize
      }
      if (typeof this.searchModel.StartOrderTime !== 'undefined') {
        params.SDateTime = parseTime(this.searchModel.StartOrderTime[0])
        params.EDateTime = parseTime(this.searchModel.StartOrderTime[1])
        this.$delete(params, 'StartOrderTime')
      }

      getReturnOrderAuditList(params).then((res) => {
        res.items.forEach((element) => {
          element.productData = ''
          element.ordersReturnProducts.forEach((item, index) => {
            if (index > 0) {
              element.productData = element.productData + '、' + item.pTitle
            } else if (index == 0) {
              element.productData = item.pTitle
            }
          })
        })
        this.tableData = res.items
        this.total = res.totalCount
      })
    },
    handleSizeChange(v) {
      this.pageSize = v
      this.currentPage = 1
      // console.log(v)
      this.getList()
    },
    handleCurrentChange(v) {
      this.currentPage = v
      // console.log(v)
      this.getList()
    },

    handColumnClick(row, name) {
      if (name == 'aduit') {
        this.$router.push({
          path: './orderExamine/detail',
          query: {
            data: JSON.stringify({
              id: row.id
            })
          }
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.auditCmpt {
  display: flex;
  flex-direction: column;
  background-color: #f0f2f5;
  .form-baseinfo:first-child {
    margin: 20px, 0, 20px, -10px;
    border-radius: 3px;
  }
  .form-baseinfo:last-child {
    background-color: #fff;
    .btn_area {
      padding: 0.2rem;
      border-top-left-radius: 3px;
      border-top-right-radius: 3px;
    }
  }
}
::v-deep .search-bar input.el-input__inner {
  width: 2rem;
}

// .form-baseinfo {
//   border: 1px solid #dcdfe6;
//   padding: 10px;
// }

.el-form-item__label {
  font-weight: normal;
}

.el-dialog__body {
  padding-top: 0px;
}

.el-divider {
  margin-top: 5px;
}

.btn_area {
  padding-left: 0.1rem;
  margin-bottom: 0.1rem;
}
</style>
